import React from 'react'
import Link from 'gatsby-link'

const NavPanel = (props) => (
    <div>
        <div id="navButton">
            <a className="toggle" href="#navPanel"></a>
        </div>
        <div id="navPanel">
            <nav>
                <a class="link depth-0" href="index.html"><span class="indent-0"></span>Home</a>
                <a class="link depth-0" href="#"><span class="indent-0"></span>Dropdown</a>
                <a class="link depth-1" href="#"><span class="indent-1"></span>Lorem ipsum dolor</a>
                <a class="link depth-1" href="#"><span class="indent-1"></span>Magna phasellus</a>
                <a class="link depth-1" href="#"><span class="indent-1"></span>Etiam dolore nisl</a>
                <a class="link depth-1" href="#"><span class="indent-1"></span>And a submenu …</a>
                <a class="link depth-2" href="#"><span class="indent-2"></span>Lorem ipsum dolor</a>
                <a class="link depth-2" href="#"><span class="indent-2"></span>Phasellus consequat</a>
                <a class="link depth-2" href="#"><span class="indent-2"></span>Magna phasellus</a>
                <a class="link depth-2" href="#"><span class="indent-2"></span>Etiam dolore nisl</a>
                <a class="link depth-1" href="#"><span class="indent-1"></span>Veroeros feugiat</a>
                <a class="link depth-0" href="left-sidebar.html"><span class="indent-0"></span>Left Sidebar</a>
                <a class="link depth-0" href="right-sidebar.html"><span class="indent-0"></span>Right Sidebar</a>
                <a class="link depth-0" href="no-sidebar.html"><span class="indent-0"></span>No Sidebar</a>
            </nav>
        </div>
    </div>
)

export default NavPanel
